1. Fragment

作为jsx的根标签,但是不渲染结构

2. 性能优化

shouldComponentUpdate 在更新阶段执行 触发条件: 1. 父组件更新 2. setState 

需要返回值. true 则组件更新  返回值是false组件不更新

this.state和this.props 是旧数据
形参nextProps和nextState是新数据

PureComponent 自动帮我们实现了shouldComponentUpdate 

3. 高阶组件(HOC)

原理: 将公共的状态和逻辑,封装到一个父组件中,哪个组件需要这些状态和逻辑,就new一个父组件实例作为这个组件的父组件
作用: 提供复用的状态和逻辑

<Test>{值}</Test> this.props.children


4.HOOK 

作用: 解决函数组件中缺少类组件功能的问题 

import {useState,useEffect} from 'react'

useState 定义状态
1. useState解决了性能问题
2. 有几个状态数据,useState就调用几次

```jsx

 const [obj, setObj] = useState({name: 'zs'})

 setObj({name: 'ls'})
```



useEffect 模拟类组件的生命周期钩子函数 挂载,更新和卸载

1. 第二个参数不写, 外层模拟挂载和更新, 内部模拟卸载
2. 第二个参数是[], 外层模拟挂载, 内部模拟卸载
3. 第二个参数中监听了数据(状态和props), 则监听的数据发生变化,外层才模拟更新, 内部还是卸载